{include file="public/header" /}
<div class="layui-body">
    <!--tab标签-->
    <div class="layui-tab layui-tab-brief">
        <ul class="layui-tab-title">
            <li class="layui-this">个人信息修改</li>
            <li class="layui-btn"><a href="javascript:void(0)"  onclick="back()" style="color: white">返回上一页</a></li>
        </ul>
        <div class="layui-tab-content">
            <div class="layui-tab-item layui-show">
                <form class="layui-form form-container" action="{:url('update')}" method="post">
                    <div class="layui-form-item">
                        <label class="layui-form-label">管理员</label>
                        <div class="layui-input-block">
                            <input type="text" name="username" id="username" value="{$admin.username}" onkeyup="usernameChecks()" class="layui-input" >
                            <input type="hidden" name="id" value="{$admin.id}">
                            <div id="usernameCheck" style="display: none;color: red;"></div>
                        </div>
                    </div>
                    <div class="layui-form-item">
                        <label class="layui-form-label">新密码</label>
                        <div class="layui-input-block">
                            <input type="password" name="newPassword" value="" id="newPwd" onblur="newPwdCheck()" required  lay-verify="required" placeholder="请输入新密码(只能是字母，和数字不能小于6个字符)" class="layui-input">
                            <div id="newPwdCheck" style="display: none;color: red;"></div>
                        </div>
                    </div>
                    <div class="layui-form-item">
                        <label class="layui-form-label">确认密码</label>
                        <div class="layui-input-block">
                            <input type="password" name="checkPassword" value="" id="pwd" onblur="pwdCheck()" required  lay-verify="required" placeholder="请再次输入你设置的密码" class="layui-input">
                            <div id="pwdCheck" style="display: none;color: red;"></div>
                        </div>
                    </div>
                    <div class="layui-form-item">
                        <label class="layui-form-label">邮箱</label>
                        <div class="layui-input-block">
                            <input type="text" name="emailbox" id="emailbox" onblur="emailCheck()" value="{$admin.email}" class="layui-input">
                            <div id="emails" style="display: none;color: red;"></div>
                        </div>
                    </div>
                    <div class="layui-form-item">
                        <label class="layui-form-label">职位选择</label>
                        <div class="layui-input-block">
                            <select name="selects"  >
                                <option value="0">请选择角色</option>
                                {volist name="result" id="val"}
                                <option value="{$val.id}.{$val.role_name}">{$val.role_name}</option>
                                {/volist}
                            </select>
                        </div>
                    </div>
                    <div class="layui-form-item">
                        <div class="layui-input-block">
                            <button class="layui-btn" lay-submit lay-filter="submit">保存</button>
                            <button type="reset" class="layui-btn layui-btn-primary">重置</button>
                        </div>
                    </div>
                </form>
            </div>
        </div>
    </div>
</div>
<script>
    function back(){
        history.back()
    }
    /**
     * ajax用户名验证
     */
    function usernameChecks(){
         var val=$("#username").val();
         if(val.length<=0){
             $("#usernameCheck").html("用户名不能为空");
             $("#usernameCheck").show();
             $("#usernameCheck").css({color:'red'});
         }else{
             $.ajax({
                 type:'GET',
                 url:"{:url('Api/checks')}",
                 data:'date='+val,
                 dataType:'JSON',
                 success:function(res){
                     console.log(res);
                     $("#usernameCheck").html("用户已经存在，请重新输入");
                     $("#usernameCheck").show();
                     $("#usernameCheck").css({color:'red'});
                 },
                 error:function(err){
                     $("#usernameCheck").hide();
                     $("#usernameCheck").css({color:'red'});
                 }
             });
         }
    }
    /**
     * 新密码验证
     */
    function newPwdCheck(){
        var val=$("#newPwd").val();
        var result=val.match(/[0-9]{3,}[a-z]{3,}/);
        if(result==null){
            $("#newPwdCheck").html("请输入6位以上的数字和字母");
            $("#newPwdCheck").show();
            $("#newPwdCheck").css({color:'red'});
        }else{
            $("#newPwdCheck").hide();
        }
    }
    /**
     * 确认密码验证
     */
     function pwdCheck(){
        var val=$("#pwd").val();
        var newval=$("#newPwd").val();
        var result=val.match(/[0-9]{3,}[a-z]{3,}/);
        if(result==null){
            $("#pwdCheck").html("请输入6位以上的数字和字母");
            $("#pwdCheck").show();
            $("#pwdCheck").css({color:'red'});
        }else{
            if(val!=newval){
                $("#pwdCheck").html("两次密码输入不一致");
                $("#pwdCheck").show();
                $("#pwdCheck").css({color:'red'});
            }
        }
    }
    /**
     * 邮箱验证
     */
    function emailCheck(){
        var email=$("#emailbox").val();
        var result=email.match(/^[0-9a-z]+@qq\.com/);
        if(result==null){
            $("#emails").html("请输入正确的邮箱格式");
            $("#emails").show();
            $("#emails").css({color:'red'});
        }else{
            $("#emails").hide();
        }
    }
</script>
{include file="public/footer" /}